<template slot-scope="scope">
  <div v-loading="loading" class="tree">
    <el-tree
      ref="authTree"
      :data="treeToJson(tree)"
      default-expand-all
      highlight-current
      node-key="id"
      show-checkbox

    >
      <span
        slot-scope="{ node, data }"
        class="custom-tree-node">
        <span>{{ node.data.text }}</span>
      </span>
    </el-tree>
  </div>
</template>

<script>
import { roleData } from '@/api/admin/auth/roleManage'
import {
  getJsonTree
} from '@/api/admin/utils/index'

export default {
  name: 'Index',
  props: { roleId: [String, Number] },
  data() {
    return {
      loading: false,
      tree: []
    }
  },
  computed: {

  },
  created() {
    this.loadData()
  },
  mounted() {

  },
  methods: {
    // tree转换
    treeToJson(tree) {
      return getJsonTree(tree)
    },
    loadData() {
      this.loading = true
      roleData(this.roleId).then(res => {
        this.loading = false
        this.tree = res.treejson
      }).catch(err => {
        this.loading = false
      })
    },
    setTreeCheckedKeys(tree) {
      debugger
    }
  }
}
</script>

<style scoped>

</style>
